import { defineStore } from 'pinia'
import { ref } from 'vue'
import {reqC1, reqC2, reqC3} from '@/api/product/attr'
import { CategoryObj } from '@/api/product/attr/type.ts'

const useCategoryStore = defineStore('category', () => {
  const mainCategoryArr = ref<CategoryObj[]>([])
  const mainCategoryId = ref('')
  const secCategoryArr = ref<CategoryObj[]>([])
  const secCategoryId = ref('')
  const thirdCategoryArr = ref<CategoryObj[]>([])
  const thirdCategoryId = ref('')

  async function getC1() {
    const result = await reqC1()
    if (result.code === 200) {
      mainCategoryArr.value = result.data
    }
  }

  async function getC2() {
    secCategoryId.value = ''
    thirdCategoryArr.value = []
    thirdCategoryId.value = ''
    const result = await reqC2(mainCategoryId.value)
    if (result.code === 200) {
      secCategoryArr.value = result.data
    }
  }

  async function getC3() {
    thirdCategoryId.value = ''
    const result = await reqC3(secCategoryId.value)
    if (result.code === 200) {
      thirdCategoryArr.value = result.data
    }
  }

  return {
    mainCategoryArr,
    mainCategoryId,
    getC1,
    secCategoryArr,
    secCategoryId,
    getC2,
    thirdCategoryArr,
    thirdCategoryId,
    getC3,
  }
})

export default useCategoryStore
